<html lang="zh" xmlns:th="http://www.thymeleaf.org">
<!--<![endif]-->
<head>
    <meta charset="utf-8"/>
    <title>我的订单 - 个人中心</title>
    <meta name="keywords" content="闪送，同城速递，专人直送，同城急件，代买，代送，代购，同城加急，同城快递，限时送达，最快的快递"/>
    <meta name="renderer" content="webkit"/>
    <meta name="description" content="闪送是国内最快的同城速递服务公司，专人直送，60分钟送达全城！24小时在线为用户提供同城急件,蛋糕,鲜花,生鲜,水果等限时递送服务。"/>
    <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge"/>
    <link rel="shortcut icon" th:href="@{/images/favicon.ico}"/>
    <link th:href="@{/css/font-awesome.min.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/font-awesome-ie7.min.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/bootstrap.min.css}" rel="stylesheet" type="text/css"/>

    <link th:href="@{/css/style-metronic.css?v=201509161736}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/style.css?v=2016120801}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/style-responsive.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/blue.css?v=2016120801}" rel="stylesheet" type="text/css" id="style_color"/>
    <link th:href="@{/css/daterangepicker.css?v=20150503203601}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/jquery.fancybox.css}" rel="stylesheet"/>
    <link th:href="@{/css/jquery.raty.css}" rel="stylesheet"/>
    <link th:href="@{/css/pagination.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/order_base.css?v=20161019001}" rel="stylesheet" type="text/css" id="style_color"/>
    <link th:href="@{/css/timepicker.css}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/jquery.fancybox.css}" rel="stylesheet"/>

    <link th:href="@{/css/custom.css?v=20161209192433}" rel="stylesheet" type="text/css" id="style_color"/>
    <link th:href="@{/css/autocomplete.css}" rel="stylesheet" type="text/css"/>
    <!-- confirmaddress.jsp style -->
    <link th:href="@{/css/confirmaddress.css}" rel="stylesheet" type="text/css" id="style_color"/>
    <link th:href="@{/css/iss.css?v=201607182014}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/modules.css?v=2016120801}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/common.css?v=20170316184648}" rel="stylesheet" type="text/css"/>
    <link th:href="@{/css/index.css?v=20170316184648}" rel="stylesheet" type="text/css"/>

    <script th:src="@{/js/jquery-3.5.1.js}" type="text/javascript"></script>
    <script th:src="@{/layer/layer.js}" type="text/javascript"></script>
    <script th:src="@{/echarts/echarts.min.js}"></script>
    <!-- BEGIN PAGE LEVEL PLUGIN STYLES -->
    <link th:href="@{/css/jquery.fancybox.css}" rel="stylesheet"/>
    <link th:href="@{/css/jquery.raty.css}" rel="stylesheet"/>
    <link th:href="@{/css/webuploader.css}" rel="stylesheet"/>
    <!-- END PAGE LEVEL PLUGIN STYLES -->
    <style type="text/css">
        .selector-for-some-widget {
            -webkit-box-sizing: content-box;
            -moz-box-sizing: content-box;
            box-sizing: content-box;
        }

        #list-item-detail-part,
        #list-item-result-part {
            display: none;
        }

        .list-group-item {
            text-align: left;
        }

        #list-item-detail-part p {
            text-align: left;
        }

        #list-item-detail-part .media-left {
            display: table-cell;
        }

        #list-item-detail-part .media-body {
            display: table-cell;
            vertical-align: middle;
        }

        #inputtousu_ordernum {
            margin-bottom: 0px;
        }

        .form-inline {
            margin-bottom: 10px;
        }

        #fileList .file-item {
            width: 81px;
            height: 81px;
            overflow: hidden;
            float: left;
            margin-right: 5px;
        }

        #fileList .info {
            display: none;
        }

        #filePicker {
            width: 82px;
            height: 38px;
            overflow: hidden;
        }

        .webuploader-pick {
            opacity: 0;
        }

        .tousu_modal_part_btn {

            background: url(images/ts.png ") left center no-repeat; background-size: 30%; color: #666; text-align: right; padding-left: 25px; } #tousu_lianxifangshi{ width:100%; height: 34px; } #tousu_submit_btn{ width: 150px; border-radius: 3px; margin-top:15px; background-image: -moz-linear-gradient(top, #febd1b, #ff8814); /* Firefox */ background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0, #febd1b), color-stop(1, #ff8814)); /* Saf4+, Chrome */ filter: progid:DXImageTransform.Microsoft.gradient(startColorstr= '#febd1b' , endColorstr= '#ff8814' , GradientType= '0'); /* IE*/ } #type_level_onelist { width: 160px; } #type_level_twolist { width: 300px; } #tousu_yuanyin { width: 470px; } #fileList .error { margin-top: -30px; } .editMobile { display: inline-block; width: 15px; height: 15px; } .editMobile img { width: 100%; }
    </style>
    <style type="text/css">.dropdown-submenu:hover& gt

    ;
    .dropdown-menu {
        display: none
    }</style>
    <style type="text/css">.dropdown-submenu:hover& gt

    ;
    .dropdown-menu {
        display: none
    }</style>
    <style type="text/css">.dropdown-submenu:hover& gt

    ;
    .dropdown-menu {
        display: none
    }</style>

</head>
<body>
<!-- BEGIN HEADER -->
<div class="hContent headerInfo">
    <header th:replace="~{commons::#top}"/>
</div>
<div class="js_pop pop_window" style="display: none">
    <span class="closePopIcon js_pop_cancel"></span>
    <div class="title js_pop_tit"></div>
    <div class="btns">
        <button class="js_pop_btn btn blue"></button>
    </div>
</div>
<div class="bottom_bar"></div>

<div class="page-container" id="container_wrapper">
    <!-- BEGIN CONTAINER -->
    <div class="js-comp container min-hight margin-bottom-40 my-order-list" data-module="MyOrderList">
        <div class="left-menu">
            <dl>
                <dt>
                    <a th:href="@{/order/list}"> <i class="icon-my-order"></i> 我的订单 </a>
                </dt>
            </dl>
            <dl>
                <dt>
                    <div>
                        <i class="icon-my-account"></i> 我的账户
                    </div>
                </dt>
                <dd>
                    <a th:href="@{/user/userAccount}"> 账户余额 </a>
                </dd>
                <dd>
                    <a th:href="@{/user/userPay}"> 充值 </a>
                </dd>
                <dd>
                    <a th:href="@{/user/discount}"> 优惠券 </a>
                </dd>
                <dd>
                    <a th:href="@{/user/usualInfo}"> 常用信息 </a>
                </dd>
                <dd>
                    <a th:href="@{/user/initcost}"> 消费统计 </a>
                </dd>
            </dl>

            <dl>
                <dt>
                    <div>
                        <i class="icon-settings"></i> 设置
                    </div>
                </dt>
                <dd>
                    <a th:href="@{/user/updatepwd}"> 修改密码 </a>
                </dd>
            </dl>

        </div>
        <!-- 为ECharts准备一个具备大小（宽高）的Dom -->
        <div class="right-container" id="main" style="width: 600px;height:400px;"></div>
        <script>
            // 基于准备好的dom，初始化echarts实例
            var myChart = echarts.init(document.getElementById('main'));
            var arr = [];
            $(function () {
                $.getJSON("/user/cost", function (data) {
                    if (data.code == 200) {
                        arr = data.data;
                        // 指定图表的配置项和数据
                        var option = {
                            title: {
                                text: '消费记录'
                            },
                            tooltip: {},
                            legend: {
                                data: ['消费金额']
                            },
                            xAxis: {
                                data: ["一月", "二月", "三月", "四月", "五月", "六月", "七月", "八月", "九月", "十月", "十一月", "十二月"]
                            },
                            yAxis: {},
                            series: [{
                                name: '消费金额',
                                type: 'bar',
                                data: arr
                            }]
                        };
                        // 使用刚指定的配置项和数据显示图表。
                        myChart.setOption(option);
                    }
                })
            })

        </script>

    </div>

</div>
<footer th:replace="~{commons::#footer}"/>
</body>
</html>